<template>
  <div>
    <el-select
      v-model="listQuery.enterprise_id"
      placeholder="请选择企业(输入关键词搜索)"
      clearable
      name="project"
      style="width: 100%;"
      filterable
      remote
      :remote-method="remoteMethod"
      @change="emitInput"
    >
      <el-option v-for="(item,index ) in lists.data" :key="index" :label="item.name" :value="item.id" />
      <div>
        <el-pagination
          v-show="lists.total>0"
          small
          layout="prev, pager, next"
          :total="lists.total"
          :page.sync="listQuery.page"
          :page-size.sync="listQuery.per_page"
          @current-change="pageChange"
          @pagination="getList"
        /></div>
    </el-select>
  </div>
</template>
<script>
import { fetchList } from '@/api/user'
export default {
  props: {
    value: {
      default: 0,
      type: Number
    }
  },
  data() {
    return {
      listQuery: {
        enterprise_id: null,
        page: 1,
        status: null,
        isshow: null,
        per_page: 15,
        keyword: null,
        type: undefined,
        sort: '+id'
      },
      lists: {
        total: 0,
        data: {}
      }
    }
  },
  created() {
    this.getList()
  },
  methods: {
    // 列表数据
    getList() {
      fetchList(this.listQuery).then(res => {
        this.lists = res.data
      })
    },
    // 关键词搜索
    remoteMethod(keyword) {
      this.listQuery.page = 1
      this.listQuery.keyword = keyword
      this.getList()
    },
    // 分页选择
    pageChange(page) {
      this.listQuery.page = page
      this.getList()
    },
    emitInput(val) {
      if (val) {
        this.$emit('input', val)
      } else {
        this.$emit('input', 0)
      }
    }
  }
}
</script>
